<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <link rel="icon" type="image/png" href="../images/icon.png">
    <title>司机信息</title>
    <link rel="stylesheet" type="text/css" href="../css/style.css">
    <script type="text/javascript" src="../js/jquery.js"></script>
    <script type="text/javascript" src="../js/template-web.js"></script>
    <script type="text/javascript" src="../js/dialog.js"></script>
    <script type="text/javascript" src="../js/info/driver.js"></script>
    <script type="text/template" id="template">
        {{each list}}
        <tr>
            <td>{{$value.driverId}}</td>
            <td>{{$value.driverIdCard}}</td>
            <td>{{$value.driverName}}</td>
            <td>{{$value.driverSex}}</td>
            <td>{{$value.driverAge}}</td>
            <td>{{$value.driverPhone}}</td>
            <td>{{$value.driverAddress}}</td>
            <td>{{$value.driverState}}</td>
            <td><a href="javascript:;">修改</a>&nbsp;&nbsp;<a href="javascript:;">驾驶记录</a></td>
        </tr>
        {{/each}}
    </script>
    <script type="text/template" id="driveTemplate">
        {{each list}}
        <tr>
            <td>{{$value.driverId}}</td>
            <td>{{$value.carId}}</td>
            <td>{{$value.driveFromTime}}</td>
            <td>{{$value.driveToTime}}</td>
        </tr>
        {{/each}}
    </script>
    <style>
        #addDriverForm {
            margin-top: -108px;
            margin-left: -122.87px;
        }
        #addDriverForm label {
            text-align: center;
            display: inline-block;
            width: 80px;
        }
    </style>
</head>

<body>
    <div class="title">
        <h1 onmouseover="this.style.cursor='pointer'" onclick="window.location.reload()" title="刷新">司机信息</h1>
    </div> 
    <div class="operation">
        <input type="text" name="driverName" placeholder="按姓名查询">
        <button id="search">查询</button>
        <button id="addDriver">添加</button>
    </div>
    <div class="content">
        <table cellpadding="0" cellspacing="0">
            <thead>
                <tr>
                    <th>司机编号</th>
                    <th>身份证号</th>
                    <th>姓名</th>
                    <th>性别</th>
                    <th>年龄</th>
                    <th>电话</th>
                    <th>地址</th>
                    <th>工作状态</th>
                    <th>操作</th>
                </tr>
            </thead>
            <tbody id="dataList">

            </tbody>
        </table>
    </div>
    <form class="form" id="addDriverForm">
        <label>身份证：</label><input type="text" name="driverIdCard"><br>
        <label>姓名：</label><input type="text" name="driverName"><br>
        <label>性别：</label>
        <select name="driverSex" style="margin-top: 6px; width: 164.8px; height: 22px; margin-left: -5px;">
            <option>男</option>
            <option>女</option>
            <option>其他</option>
        </select><br>
        <label>年龄：</label><input type="text" name="driverAge" onkeyup="value=value.replace(/[^\d]/g,'')" placeholder="只允许输入数字"><br>
        <label>电话：</label><input type="text" name="driverPhone"><br>
        <label>地址：</label><input type="text" name="driverAddress"><br>
        <label>工作状态：</label>
        <select name="driverState" style="margin-top: 6px; width: 164.8px; height: 22px; margin-left: -5px;">
            <option>未接单</option>
            <option>已接单</option>
            <option>未出勤</option>
        </select><br>
        <input type="button" value="提交" style="margin-left: 113.67px; margin-top: 20px;">
    </form>
    <div id="drive" style="display: none;overflow-y: scroll; height: 360px;">
        <table cellpadding="0" cellspacing="0">
            <thead>
                <tr>
                    <th>司机编号</th>
                    <th>车辆编号</th>
                    <th>开始时间</th>
                    <th>结束时间</th>
                </tr>
            </thead>
            <tbody id="driveList">

            </tbody>
        </table>
    </div>
</body>

</html>